﻿var bepop = bepop || {};

bepop.modelFactory = function (model, template) {
	if (typeof model != "object") throw new Error("bepop.modelFactory: Invalid param arg.");
	switch (model.url) {
		case "#enjoy":
			model = new bepop.model.gallery.Covers();
			break;
		case "#contact":
			model = bepop.model.contacts;
			break;
	}
	ko.applyBindings(model, template);
};

bepop.model = bepop.model || {};

bepop.init = function (navTab, navigatonClick) {
	ko.applyBindings(new bepop.model.navigate.Menu(navigatonClick), navTab);
};

bepop.model.system = {
	isCanvasSupported: !!window.HTMLCanvasElement,
	isDragAndDropSupported: 'draggable' in document.createElement('span')
};

/*contacts tab*/
bepop.model.contacts = {
	email: "bepopsup@gmail.com",
	href: "mailto: bepopsup@gmail.com"
};

/*navigate*/
bepop.model.navigate = bepop.model.navigate || {};

bepop.model.navigate.MenuItem = function (name, url, select) {
	if (typeof name != "string" || name == ""
		|| typeof url != "string" || url.indexOf("#") != 0
			|| typeof select != "undefined" && typeof select != "boolean") throw new Error("bepop.model.ManuItem: Invalid param arg.");

	this.name = name;
	this.url = url;
	this.cl = select ? "active" : "";
};

bepop.model.navigate.Menu = function (navigatonClick) {
	var self = this;
	self.title = "Be Popular",
	self.items = ko.observableArray([
			new bepop.model.navigate.MenuItem("Home", "#home", true),
			new bepop.model.navigate.MenuItem("About", "#about"),
			new bepop.model.navigate.MenuItem("Contact", "#contact"),
			new bepop.model.navigate.MenuItem("Enjoy", "#enjoy")]),
	self.navigateTab = function (model, e) {
		var id = model.url.replace("#", "");

		if (bepop.view.common.single(id) != true) {
			var template = bepop.view.common.single(id, true);
			bepop.modelFactory(model, template);
		}

		if (typeof navigatonClick == "function") {
			navigatonClick(e.originalEvent);
		}

	};
};

/*enjoy tab*/
bepop.model.gallery = bepop.model.gallery || {};

bepop.model.gallery.Cover = function (url, width, height) {
	if (url == null || typeof url != "string" || url == ""
		|| width == null || typeof width != "number" || width < 0
			|| height == null || typeof height != "number" || height < 0) throw new Error("bepop.model.gallery.Cover: Invalid param arg.");

	this.url = url;
	this.width = width;
	this.height = height;
};

bepop.model.gallery.Covers = function () {
	var self = this;
	var popupTemplate = document.getElementById("modal");

	self.items = ko.observableArray([
		new bepop.model.gallery.Cover('http://cdn2.lostateminor.com/wp-content/uploads/2012/05/time-magazine-cover.jpg', 480, 639)
	]);

	self.requirements = {
		noSupport: ko.observable(!bepop.model.system.isCanvasSupported || !bepop.model.system.isDragAndDropSupported),
		dragAndDrop: ko.observable(!bepop.model.system.isDragAndDropSupported)
	};

	self.makeCoverPopup = function (cover) {
		bepop.modelFactory(cover, popupTemplate);
		bepop.view.popup.showPopup(cover);
	};

	self.dragLeavePhoto = function (cover, e) {
		return false;
	};

	self.dragOverPhoto = function (cover, e) {
		return false;
	};

	self.dropPhoto = function (cover, e) {
		debugger;
		event.preventDefault();
		var file = event.dataTransfer.files[0];

		var maxFileSize = 1000000;
		if (file.size > maxFileSize) {
			return false;
		}

		return false;
	};

	//	bepop.picasa.downloadImagesAsync("114736267714313794052", "5758490467506056097", function (image) {
	//		self.items.push(new bepop.model.gallery.Cover(image.url, image.width, image.height));
	//	});
};